// pages/view/index.js
const app = getApp()
var ctx = wx.createCanvasContext('myCanvas')
Page({
  data: {
    beijingurl: '../../img/map.jpg',
    scale: 1,
    hcale: 1,
    lineshow: 'lineshow',
    lineshow1: '',
    isShow: false,
    imgpath: '',
    sortline: '',
    httpimg: 'http://demo.yoois.com/addons/maixun_wuxilvyou/icon/bg.jpg',
    tempImgPath: '',
    navTab: [
      {
        name: '景区',
        pic: '../../img/icon9.png',
        pica: '../../img/icon9a.png'
      },
      {
        name: '路线',
        pic: '../../img/icon10.png',
        pica: '../../img/icon10a.png'
      },
      {
        name: '餐饮',
        pic: '../../img/icon11.png',
        pica: '../../img/icon11a.png'
      },
      {
        name: '住宿',
        pic: '../../img/icon12.png',
        pica: '../../img/icon12a.png'
      }
    ],
    activeIndex: 0,
    spotlist: null,
    // 景区
    // 景点弹窗内容
    viewText: '',
    viewInfo: '',
    // 景点激活
    actView: 0,
    // 路线
    actHotel: 0,
    // 路线弹窗
    viewShow: false,
    wrapHeight: null
  },
  onLoad: function(options) {
    var page = this

    wx.getSystemInfo({
      success: function(res) {
        page.setData({
          wrapHeight: res.windowHeight - (res.windowHeight * 0.06 + 150)
        })
      }
    })

    page.setData({
      imgpath: app.data.imgpath
    })
    wx.showLoading({
      title: 'Loading',
      mask: true
    })
    //指定图片的URL
    wx.getSystemInfo({
      success: function(res) {
        // console.log(res.screenHeight)
        // console.log(res.screenHeight / 1350)
        page.setData({
          scale: res.screenWidth / 750,
          hcale: res.screenHeight / 1350
        })
      }
    })
    //img.src = "../../img/map.jpg";
    app.util.request({
      url: 'entry/wxapp/Spot',
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      method: 'POST',
      data: {},
      success: function(res) {
        wx.hideLoading()
        // console.log(res.data)
        if (res.data.code == 200) {
          page.setData({
            spotlist: res.data.data
          })
        } else {
          wx.showToast({
            title: '请求错误！',
            icon: 'none',
            duration: 2000,
            mask: true
          })
        }
      },
      fail: function() {
        wx.hideLoading()
      }
    })
  },
  //景点 详情
  goinfo: function(e) {
    var page = this
    var activeIndex = page.data.activeIndex
    // console.log(activeIndex)
    if (activeIndex == 0 || activeIndex == 1) {
      // console.log(e.currentTarget.dataset.data)
      wx.navigateTo({
        url: '../view-detail/view-detail?id=' + e.currentTarget.dataset.data.id
      })
    }
    if (activeIndex == 2) {
      //console.log(e.currentTarget.dataset.data)
      wx.navigateTo({
        url: '../food/food?id=' + e.currentTarget.dataset.data.id
      })
    }
    if (activeIndex == 3) {
      //console.log(e.currentTarget.dataset.data)
      wx.navigateTo({
        url: '../stay/stay?id=' + e.currentTarget.dataset.data.id
      })
    }
  },
  //   //路线 详情
  // golxinfo: function (e) {

  // },
  //   //餐饮 详情
  // gofoodinfo: function (e) {

  // },
  //住宿 详情
  gostayinfo: function(e) {
    //console.log(e.currentTarget.dataset.data)
    wx.navigateTo({
      url: '../stay/stay?id=' + e.currentTarget.dataset.data.id
    })
  },
  //餐饮 详情
  gofoodinfo: function(e) {
    // console.log(e.currentTarget.dataset.data)
    wx.navigateTo({
      url: '../food/food?id=' + e.currentTarget.dataset.data.id
    })
  },
  //查看线路
  lookline: function(e) {
    //console.log('sdf');
    var page = this
    page.setData({
      isShow: false
    })
    ctx.clearRect(0, 0, 1000 * page.data.scale, 1677 * page.data.scale)
    var info = e.currentTarget.dataset.data
    app.util.request({
      url: 'entry/wxapp/spotline',
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      method: 'POST',
      data: {
        id: info.id
      },
      success: function(res) {
        wx.hideLoading()
        //console.log(res.data)
        var linedata = res.data.data
        if (res.data.code == 200) {
          page.setData({
            sortlineinfo: info,
            sortline: linedata,
            lineshow1: 'lineshow',
            lineshow: ''
          })
          wx.getImageInfo({
            src: page.data.httpimg, //请求的网络图片路径
            success: function(res) {
              var bg_img = res.path
              ctx.clearRect(
                0,
                0,
                1000 * page.data.scale,
                1677 * page.data.scale
              )
              ctx.drawImage(
                bg_img,
                0,
                0,
                1000 * page.data.hcale,
                1677 * page.data.hcale
              )
              ctx.lineWidth = 4
              ctx.setStrokeStyle('#feef78')
              ctx.setGlobalAlpha(0.9)
              ctx.moveTo(
                linedata[0].x * page.data.scale,
                linedata[0].y * page.data.scale
              )
              //for (var i = 1; i < linedata.length; i++) {
              //ctx.lineTo((linedata[i].x) * page.data.hcale , (linedata[i].y) * page.data.scale);
              //}
              var lastpoint
              for (var i = 0; i < linedata.length; i++) {
                if (i > 0) {
                  var m = {
                    x: linedata[i].x * page.data.hcale,
                    y:
                      (linedata[i].y * page.data.scale - lastpoint.y) / 2 +
                      lastpoint.y
                  }
                  ctx.bezierCurveTo(
                    lastpoint.x,
                    lastpoint.y,
                    m.x,
                    m.y,
                    linedata[i].x * page.data.hcale,
                    linedata[i].y * page.data.scale
                  )
                }
                lastpoint = {
                  x: linedata[i].x * page.data.hcale,
                  y: linedata[i].y * page.data.scale
                }
              }
              ctx.stroke()
              ctx.draw(false, function() {
                Okgenerate(page)
              })
            }
          })
        } else {
          wx.showToast({
            title: '请求错误！',
            icon: 'none',
            duration: 2000,
            mask: true
          })
        }
      },
      fail: function() {
        wx.hideLoading()
      }
    })
  },
  //线路返回
  linereturn: function() {
    this.setData({
      lineshow1: '',
      lineshow: 'lineshow',
      beijingurl: '../../img/map.jpg'
    })
  },

  // 控制景点弹窗
  viewShow: function(e) {
    //console.log(e.currentTarget.dataset)
    var info = e.currentTarget.dataset.info
    this.setData({
      viewShow: true,
      viewText: e.currentTarget.dataset.name,
      viewInfo: info
    })
  },
  viewClose: function(e) {
    this.setData({
      viewShow: false
    })
  },
  //打卡
  clock: function(e) {
    //console.log('e')
    var page = this
    var activeIndex = page.data.activeIndex
    //console.log(activeIndex)
    if (activeIndex == 0 || activeIndex == 1) {
      //console.log(e.currentTarget.dataset.data.id)
      wx.navigateTo({
        url: '../clock/clock?spotid=' + e.currentTarget.dataset.data.id
      })
    }
  },
  //详情
  detail: function(e) {
    //console.log('e')
  },
  //导航
  navigation: function(e) {
    //console.log(e.target.dataset.info)
    //console.log(parseFloat(e.target.dataset.info.latitude));
    var info = e.target.dataset.info
    wx.getLocation({
      //获取当前经纬度
      type: 'wgs84', //返回可以用于wx.openLocation的经纬度，官方提示bug: iOS 6.3.30 type 参数不生效，只会返回 wgs84 类型的坐标信息
      success: function(res) {
        wx.openLocation({
          //​使用微信内置地图查看位置。
          latitude: parseFloat(info.latitude), //要去的纬度-地址
          longitude: parseFloat(info.longitude), //要去的经度-地址
          name: info.scenic_spot_name,
          address: info.jianjie
        })
      }
    })
  },

  switchTab: function(e) {
    var page = this
    //console.log(e.currentTarget.dataset.idx)
    var tab_num = e.currentTarget.dataset.idx
    if (tab_num == 0) {
      app.util.request({
        url: 'entry/wxapp/Spot',
        header: {
          'content-type': 'application/x-www-form-urlencoded'
        },
        method: 'POST',
        data: {},
        success: function(res) {
          wx.hideLoading()

          if (res.data.code == 200) {
            page.setData({
              spotlist: res.data.data
            })
          } else {
            wx.showToast({
              title: '请求错误！',
              icon: 'none',
              duration: 2000,
              mask: true
            })
          }
        },
        fail: function() {
          wx.hideLoading()
        }
      })
    }
    if (tab_num == 1) {
      var page = this
      ctx.clearRect(0, 0, 1000 * page.data.scale, 1677 * page.data.scale)

      app.util.request({
        url: 'entry/wxapp/Line',
        header: {
          'content-type': 'application/x-www-form-urlencoded'
        },
        method: 'POST',
        data: {},
        success: function(res) {
          wx.hideLoading()
          if (res.data.code == 200) {
            page.setData({
              linelist: res.data.data,
              lineshow1: '',
              lineshow: 'lineshow'
            })
          } else {
            wx.showToast({
              title: '请求错误！',
              icon: 'none',
              duration: 2000,
              mask: true
            })
          }
        },
        fail: function() {
          wx.hideLoading()
        }
      })
    }

    if (tab_num == 2) {
      app.util.request({
        url: 'entry/wxapp/getfood',
        header: {
          'content-type': 'application/x-www-form-urlencoded'
        },
        method: 'POST',
        data: {},
        success: function(res) {
          wx.hideLoading()
          if (res.data.code == 200) {
            page.setData({
              foodlist: res.data.data
            })
          } else {
            wx.showToast({
              title: '请求错误！',
              icon: 'none',
              duration: 2000,
              mask: true
            })
          }
        },
        fail: function() {
          wx.hideLoading()
        }
      })
    }
    if (tab_num == 3) {
      app.util.request({
        url: 'entry/wxapp/getstay',
        header: {
          'content-type': 'application/x-www-form-urlencoded'
        },
        method: 'POST',
        data: {},
        success: function(res) {
          wx.hideLoading()
          if (res.data.code == 200) {
            page.setData({
              staylist: res.data.data
            })
          } else {
            wx.showToast({
              title: '请求错误！',
              icon: 'none',
              duration: 2000,
              mask: true
            })
          }
        },
        fail: function() {
          wx.hideLoading()
        }
      })
    }
    this.setData({
      activeIndex: e.currentTarget.dataset.idx
    })
  },
  scroll: function(e) {
    // console.log(e)
  }
})

//生成图片
function Okgenerate(page) {
  //生成图片方法
  //生成图片方法
  wx.canvasToTempFilePath({
    //生成图片
    x: 0,
    y: 0,
    quality: 1,
    fileType: 'jpg',
    canvasId: 'myCanvas',
    success: function(res) {
      console.log(res.tempFilePath)
      page.setData({
        beijingurl: res.tempFilePath,
        isShow: true
      })
    }
  })
}
